<template>
  <div class="tabList">
    <ul class="listBox">
      <li v-for="(list,index) in message" :key="index" @click="goPath(list.path,list.Text)">
        <img :src="list.imgSrc" alt="">
        <p style="margin-top:.03rem;">{{list.Text}}</p>
      </li>
    </ul>
  </div>
</template>
<script>
export default {
    props:{
      message:{
      type:Array
    },
      call:{
      type:String
    }
  }, 
  data(){
    return{

    }
  },
  created(){
    console.log('message',this.call)
  },
  methods:{
    goPath(path,Text){
      if(Text=='联系社区'){
        this.tel()
      }else{
        this.$router.push(path)
      }
    },
    tel(){
      if(this.call){
        window.location.href = `tel:${this.call}`
      }else{
        this.$toast('此物业暂未设置联系电话')
      }
    },
  }
}
</script>
<style scoped>
  .tabList{
    margin-top: .6rem;
  }
  .listBox{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: .26rem;
  }
  .listBox li{
     width: 25%;
     font-weight: lighter;
     margin-bottom: .3rem;
     text-align: center;
  }
  .listBox li img{
     width:.6rem;
     height:.6rem;
  }
</style>